.pxToRem(@p, @px){
    @{p}: @px / 75px * 1rem;
}
.header{
    width:100%;
    .pxToRem(height, 90);
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: absolute;
    left:0;
    top:0;
    .left{
        img{
            .pxToRem(width, 20);
            .pxToRem(height, 37);
            .pxToRem(margin-left, 32);
        }
    }
    .center{
        .pxToRem(font-size, 36);
        font-weight: bold;
        color:#af50db;
    }
    .right{
        .pxToRem(font-size, 30);
        .pxToRem(margin-right, 32);
        color: #666;
    }
}
.nav{
    width:100%;
    .pxToRem(height, 66);
    .pxToRem(margin-top, 90);
    background:#af50db;
    .left{
        text-align: center;
        color:#fff;
        .pxToRem(font-size, 27);
        .pxToRem(line-height, 66);
        img{
            .pxToRem(width, 30);
            .pxToRem(height, 27);
            .pxToRem(margin-left, 30);
            .pxToRem(margin-right,10);
        }
    }
    .right{
        img{
            float: right;
            .pxToRem(margin-right, 30);
            .pxToRem(width, 32);
            .pxToRem(height, 32);
            .pxToRem(margin-top, 18);
        }
    }
}
.main{
    width:100%;
    .pxToRem(height, 300);
    border-bottom:1px solid #ececec;
    .left{
        width:37%;
        float:left;
        .pxToRem(height, 300);
        img{
            margin-left:11%;
            .pxToRem(width, 220);
            .pxToRem(height, 220);
            .pxToRem(margin-top, 28);
        }
    }
    .right{
        width:63%;
        float:right;
        .pxToRem(height, 300);
        .p1{
            .pxToRem(font-size, 26);
            .pxToRem(margin-top, 30);
            color: #e0e0e0;
            span{
                .pxToRem(margin-left, 86);
                img{
                    .pxToRem(width, 12);
                    .pxToRem(height, 20);
                    .pxToRem(margin-left, 10);
                }
            }
        }
        .p2{
            color:#e0e0e0;
            .pxToRem(font-size, 22);
            .pxToRem(padding-left, 15);
            .pxToRem(padding-top, 5);
            background: url(../img/z_6.png) no-repeat;
            background-size: 36px;
            background-size: 62px;  
        }
        .p3{
            .pxToRem(font-size, 22);
            .pxToRem(margin-top, 80);
            .span{
                color:#af50db;
                .pxToRem(font-size, 28);
            }
            .span1{
                .pxToRem(padding, 30);
                background: #af50db;
                border-radius: 50%;
                .pxToRem(margin-left, 66);
                .pxToRem(margin-right, 30);
                color:#fff;
            }
            .span2{
                .pxToRem(padding, 28);
                .pxToRem(margin-left, 30);
                background: #af50db;
                border-radius: 50%;
                color:#fff;
            }
        }
    }
}
.footer{
    width:100%;
    .pxToRem(height, 90);
    background: #f2f2f2;
    display: flex;
    align-items: center;
    position: absolute;
    bottom:0;
    left:0;
    .left{
        width:20%;
        border-right: 1px solid #dddddd;
        img{
            .pxToRem(width, 50);
            .pxToRem(height, 40);
            .pxToRem(margin-left, 50);
        }
    }
    .center{
        width:40%;
        text-align: center;
        .pxToRem(font-size, 22);
        .p1{
            .pxToRem(margin-top, 20);
            color: #000;
        }
        p{
            color:#af50db;
            .pxToRem(margin-top, -20);
        }
    }
    .right{
        width:35%;
        .pxToRem(line-height, 90);
        .pxToRem(font-size, 34);
        text-align: center;
        background: #af50db;
        color:#fff;
    }
}